<template>
  <AmBaseTable ref="AmBaseTableRef"
               :schema="modelSchema"
               :record-config="record"
               @paramsChange="getList"
               :operations="[
                  {
                    label: '导出',
                    auth: ['am:amMineBorrow:export'],
                    clickCB: this.handleExport,
                    buttonProps: {
                      type: 'warning',
                      icon: 'el-icon-download',
                    },
                  },
                ]"
               :actions="[
                  {
                    label: '详情',
                    auth: ['am:amMineBorrow:detail'],
                    clickCB: this.handleReview,
                    buttonProps: {
                      icon: 'el-icon-edit-outline',
                    }
                  },
                  {
                    label: '审核记录',
                    auth: ['am:amMineBorrow:approval'],
                    tooltip: (row) => {
                      if(row.status === '0') {
                        return '暂无审核信息'
                      } else {
                        return false
                      }
                    },
                    clickCB: this.handleApprovalRecord,
                    disabledCtrl: (row) => ['0'].includes(row.status),
                    buttonProps: {
                      icon: 'el-icon-tickets',
                    }
                  },
                  {
                    label: '编辑',
                    auth: ['am:amMineBorrow:edit'],
                    tooltip: (row) => {
                      if(row.status === '1') {
                        return '信息审核中，请等待'
                      } else if(row.status === '2') {
                        return '信息审核已通过'
                      } else if(row.status === '5') {
                        return '流程已关闭'
                      } else {
                        return false
                      }
                    },
                    disabledCtrl: (row) => ['1', '2', '5'].includes(row.status),
                    clickCB: this.handleEdit,
                    buttonProps: {
                      icon: 'el-icon-edit-outline',
                    }
                  },
                  {
                    label: '撤销',
                    auth: ['am:amBorrow:repeal'],
                    tooltip: (row) => {
                      if(row.status === '0') {
                        return '信息未提交'
                      } else if(row.status === '5') {
                        return '流程已关闭'
                      } else if(['3', '4']) {
                        return '当前状态不可撤销'
                      } else {
                        return false
                      }
                    },
                    disabledCtrl: (row) => !['1', '2'].includes(row.status),
                    clickCB: this.handleCancel,
                    buttonProps: {
                      icon: 'el-icon-download',
                    }
                  },
                ]">
    <!--    <template v-slot:column-id="scope">{{ scope }}</template>-->
    <template v-slot:column-billName="scope">
      <el-tag>{{ scope.row.billName }}</el-tag>
    </template>
    <template v-slot:column-statusName="scope">
      <el-tag :type="statusTypeMap[scope.row.status]">{{ scope.row.statusName }}</el-tag>
    </template>
    <!-- 扩展区 -->
    <template #extend>
<!--      <ModalApprove ref="ModalApproveRef" />-->
<!--      <ModalBorrow ref="ModalBorrowRef" />-->
<!--      <ModalReturn ref="ModalReturnRef" />-->
      <ModalCancel ref="ModalCancelRef" @success="getList"/>
      <ModalDetail ref="ModalDetailRef"/>
      <ModalApprovalDetail ref="ModalApprovalDetailRef"/>
      <ModalBorrow ref="ModalBorrowRef" @success="getList" />
    </template>
  </AmBaseTable>
</template>

<script>
import {delDescription, listDescription} from "@/api/am/description";
import AmBaseTable from "../../../components/AmComp/AmBaseTable.vue";
import {modelSchema} from "./model";
// import ModalApprove from "./ModalDetail.vue";
import ModalCancel from "./ModalCancel.vue";
import ModalDetail from "./ModalDetail.vue";
import {listAmBorrow} from "@/api/am/amBorrow";
import ModalBorrow from "../amQuery/ModalBorrow.vue";
import ModalApprovalDetail from "./ModalApprovalDetail.vue";
// import ModalBorrow from "./ModalCancel.vue";

export default {
  name: "Description",
  components: {
    ModalBorrow,
    AmBaseTable,
    ModalDetail,
    ModalCancel,
    ModalApprovalDetail,
  },
  data() {
    return {
      modelSchema,
      record: {
        // 显示搜索条件
        showSearch: true,
        data: [],
        total: 0,
        loading: false,
      },
      statusTypeMap: {
        '0': 'warning',
        '1': 'default',
        '2': 'success',
        '3': 'danger',
        '5': 'info',
      }
    };
  },
  computed: {
    currUserId() {
      return this.$store.getters.userId
    }
  },
  mounted() {
    this.$nextTick(() => this.getList());
  },
  methods: {
    /** 查询档案著录列表 */
    getList() {
      this.record.loading = true;
      const queryParams = {
        ...this.$refs.AmBaseTableRef.getQueryParams(),
        userId: this.currUserId,
      };
      listAmBorrow(queryParams).then(response => {
        this.record.data = response.rows;
        this.record.total = response.total;
        this.record.loading = false;
      });
    },
    /** 审批按钮操作 **/
    handleEdit(row) {
      this.$refs.ModalBorrowRef.open(row, true);
    },
    handleApprovalRecord(row) {
      console.log(row);
      this.$refs.ModalApprovalDetailRef.open(row)
    },
    /** 审批按钮操作 **/
    handleReview(row) {
      this.$refs.ModalDetailRef.open(row);
    },
    /** 归还按钮操作 **/
    handleCancel(row) {
      this.$refs.ModalCancelRef.open(row);
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('am/amBorrow/export', {
        ...this.queryParams
      }, `amBorrowStatic_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>
